<?xml version="1.0" encoding="UTF-16"?> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <meta http-equiv="refresh" content="900; url=LockBackground.html"/> <script type="text/javascript" src="time.js" charset="iso-8859-1"></script> <style> body {background-color:none;margin:0 auto;} #background {position:absolute;top:0px;left:0px;width:320px;height:460px;} #clock {top: 140px;color:#FFFFFF;text-shadow: 0px 0px 2px #000;opacity:0.9;width: 320px;position: absolute;left: 0px;font-family:Helvetica;} #hours {font-size: 136px;width: 142px;line-height: 136px;float: left;letter-spacing: 0px;} #minutes {font-size: 136px;width: 142px;line-height: 136px;float: left;letter-spacing: 0px;} #seconds {font-size: 18px;width: 320px;line-height: 136px;float: left;text-align:center;padding-top: 20px;} #calendar {top:325px;color:#FFFFFF;text-shadow:0px 0px 2px #000;opacity:0.9;width:320px;position:absolute;left:0px;font-family:Futura;letter-spacing:2px;} #weekday {line-height:25px;font-size:13px;padding-bottom:5px;} #date {line-height:25px;font-size:13px;padding-bottom:5px;} </style> </head> <body> <div id="background"> <img src="/private/var/mobile/Library/SpringBoard/Converted-LockBackground.jpg" height="480" width="320" style="position: absolute;"> <img style="position:absolute" src="background.png" width="320" height="480"></img> </div> <base href="Time"/> <div style="position:relative; font-size:50px; z-index:2;"> <table style="position: absolute; top: 124px; left: 30px; width: 280px; height: 460px;" text-align="center"><td height="40" border="0"> <img src="Time/8.png" name="hr1" width="26" height="36"> <img src="Time/8.png" name="hr2" width="26" height="36"> <img src="Time/pm.png" name="ampm" width="7" height="36"> <img src="Time/8.png" name="mn1" width="26" height="36"> <img src="Time/8.png" name="mn2" width="26" height="36"> </td> </table> <script type="text/javascript"> <!-- start dg0 = new Image();dg0.src="Time/0.png"; dg1 = new Image();dg1.src="Time/1.png"; dg2 = new Image();dg2.src="Time/2.png"; dg3 = new Image();dg3.src="Time/3.png"; dg4 = new Image();dg4.src="Time/4.png"; dg5 = new Image();dg5.src="Time/5.png"; dg6 = new Image();dg6.src="Time/6.png"; dg7 = new Image();dg7.src="Time/7.png"; dg8 = new Image();dg8.src="Time/8.png"; dg9 = new Image();dg9.src="Time/9.png"; dgam=new Image();dgam.src="Time/am.png"; dgpm=new Image();dgpm.src="Time/pm.png"; function dotime(){theTime=setTimeout('dotime()',1000); d = new Date(); hr = d.getHours()+100; mn = d.getMinutes()+100; se = d.getSeconds()+100; if(hr==100){hr=112;am_pm='am';} else if(hr<112){am_pm='am';} else if(hr==112){am_pm='pm';} else if(hr>112){am_pm='pm';hr=(hr-0);} tot=''+hr+mn+se; document.hr1.src = 'Time/'+tot.substring(1,2)+'.png'; document.hr2.src = 'Time/'+tot.substring(2,3)+'.png'; document.mn1.src = 'Time/'+tot.substring(4,5)+'.png'; document.mn2.src = 'Time/'+tot.substring(5,6)+'.png'; document.ampm.src= 'Time/'+am_pm+'.png';} dotime(); //end --> </script> </div> <div id="clock"> <div id="hours"> <script language="JavaScript">updateClock(); setInterval('updateClock()', 1000 )</script> </div> <div id="minutes"> <script language="JavaScript">updateClock(); setInterval('updateClock()', 1000 )</script> </div> </div> <div id="calendar"> <div id="weekday" style="position: absolute; top: -5px; left: 180px; width: 140px; height: 30px;"> <script language="JavaScript">calendarDate(); setInterval('calendarDate()', 1000 )</script> </div> <div id="date" style="position: absolute; top: 15px; left: 180px; width: 140px; height: 30px;"> <script language="JavaScript">calendarDate(); setInterval('calendarDate()', 1000 )</script> </div> </div> </body> </html>